import notFoundImg from '@/assets/images/nocourse.png'
import { Popup } from 'antd-mobile'
import Styles from './welfare.module.less'
import React, { FC } from 'react'
import { GoodsData, OthersData } from '@/types/product'
import { EProductType } from '@/types/enum'

interface setWelfare {
  goodsData?: GoodsData
  othersData?: OthersData
  setVisible: (status: boolean) => void
}
const empty: FC<setWelfare> = (props) => (
  <Popup
    visible={true}
    onMaskClick={() => {
      props.setVisible(false)
    }}
    bodyStyle={{ height: '40rem' }}
  >
    <div className=" pl-r1.6 pr-r1.6 ">
      <div className=" text-center text-gray-333333 text-r1.6 leading-r1.6 font-medium font-medium-family relative pl-r1.0 pr-r1.0 pt-r1.6 pb-r2.0">
        <span>商品福利</span>
        <span
          className=" absolute right-0 w-r2.0 h-r2.0 text-r1.6"
          onClick={() => {
            props.setVisible(false)
          }}
        >
          <i className="iconfont icon-icon_colse"></i>
        </span>
      </div>
      {props.goodsData ? (
        <div className=" text-r1.2 h-r13.4 overflow-hidden  ">
          <span className=" text-r1.5 font-medium text-gray-333333 font-medium-family ">
            配套讲义
          </span>
          <span className=" float-right text-gray-333333 text-r1.3 font-normal  font-medium-family ">
            共{props.goodsData.giftProductNum}件，总计
            <span className=" text-red-E02727 text-r1.5 font-medium font-medium-family ">
              {' '}
              ¥{props.goodsData.allProducPrice}
            </span>
          </span>
          <div className=" text-right">
            <div className={Styles['record']}>{props.goodsData.giftproductDesc}</div>
          </div>
          <div className="h-r7.6 pt-r3.1">
            {props.goodsData.giftsDetails.map((val, key) => {
              return (
                <div key={key}>
                  <span className="inline-block text-gray-333333 text-r1.3 h-r2.0  leading-r2.0  font-medium-family w-r31.0 truncate">
                    {val.giftProductName}
                  </span>
                  <span className=" float-right  text-r1.3 h-r2.0  leading-r2.0 ">
                    ¥{val.giftProductPrice}
                  </span>
                </div>
              )
            })}
          </div>
        </div>
      ) : null}
      {props.othersData ? (
        <div className=" text-r1.2 h-r13.4 overflow-hidden  ">
          <span className=" text-r1.5 font-medium">其他赠品</span>
          <span className=" text-gray-adb4be text-r1.2 font-normal ">
            {props.othersData.giftproductDesc}
          </span>
          <div className="h-r7.6 pt-r3.1">
            {props.othersData.giftsDetails.map((val, key) => {
              return (
                <div key={key}>
                  <div>
                    {val.giftType === EProductType.COURSE ? (
                      <i className="iconfont icon-icon_zengke text-red-300 mr-r1.0"></i>
                    ) : null}
                    {val.giftType === EProductType.ENTITY ? (
                      <i className="iconfont icon-icon_liwu text-red-300 mr-r1.0"></i>
                    ) : null}
                    {val.giftType === EProductType.COIN ? (
                      <i className="iconfont icon-icon-icon_juan text-red-300 mr-r1.0"></i>
                    ) : null}
                    {val.giftType != EProductType.COIN &&
                    val.giftType != EProductType.ENTITY &&
                    val.giftType != EProductType.COURSE ? (
                      <i className="iconfont icon-change_one text-red-300 mr-r1.0"></i>
                    ) : null}

                    <span className=" text-gray-333333">{val.giftTypeName}</span>
                  </div>
                  <div className=" text-gray-333333 text-r1.3 h-r2.0 font-regular font-normal inline-block">
                    {val.giftProductNames}
                  </div>
                </div>
              )
            })}
          </div>
        </div>
      ) : null}
    </div>
  </Popup>
)

export default empty
